.updown a {
	position: absolute;
	bottom: 20px;
	right: 50px;
	z-index: 10;
	opacity: .6;-moz-opacity: .6;-webkit-opacity: .6;
	display: inline-block;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
	color: #fff;
	font : normal 400 20px/1 'Josefin Sans', sans-serif;
	letter-spacing: .1em;
	text-decoration: none;
	transition: opacity .3s;
}
.updown a:hover {opacity: .3;-moz-opacity: .3;-webkit-opacity: .3;}
#s .s-icon {
	padding-top: 60px;
}
#s .s-icon span {
	position: absolute;
	top: 0;
	left: 50%;
	width: 30px;
	height: 50px;
	margin-left: -15px;
	border: 2px solid #fff;
	border-radius: 50px;
	box-sizing: border-box;
}
#s .s-icon span::before {
	position: absolute;
	top: 10px;
	left: 50%;
	content: '';
	width: 6px;
	height: 6px;
	margin-left: -3px;
	background-color: #fff;
	border-radius: 100%;
	-webkit-animation: sdb10 2s infinite;
	animation: sdb10 2s infinite;
	box-sizing: border-box;
}
@-webkit-keyframes sdb10 {
	0% {
		-webkit-transform: translate(0, 0);
		opacity: 0;
	}
	40% {
		opacity: 1;
	}
	80% {
		-webkit-transform: translate(0, 20px);
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}
@keyframes sdb10 {
	0% {
		transform: translate(0, 0);
		opacity: 0;
	}
	40% {
		opacity: 1;
	}
	80% {
		transform: translate(0, 20px);
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}
/*pro*/
.index-pro{background-color: #eaeaea;background-image: url("../images/pro-1-bg.png")/*tpa=http://www.leixmark.com/images/pro-1-bg.png*/;background-repeat: no-repeat;background-position: center top;padding: 60px 0 30px 0;}
#prolist{padding: 0 0 30px 0;}
#prolist .owl-wrapper-outer{margin:0 auto;}
#prolist .item{width:260px;height:350px;margin:10px auto;text-align: center; background-color:#fff;-webkit-box-shadow: 1px 0 20px rgba(0,0,0,0.05);box-shadow: 1px 0 20px rgba(0,0,0,0.05);}
#prolist .item:after{
	content: '';
	width: 30px;height: 6px;background-color:#1f7ce6;position: absolute;bottom: 10px;left: 50%;margin-left: -15px;
	transition:all 0.5s;
    -moz-transition:all 0.5s; /* Firefox 4 */
    -webkit-transition:all 0.5s; /* Safari and Chrome */
    -o-transition:all 0.5s;
	-ms-transition:all 0.5s;
}
#prolist .item a{color:#333;display: block;position:relative;width:100%;height:100%;padding: 10px 0 0 0;}
#prolist .item a .info{text-align: center;}
#prolist .item a .info h4{font-size:14px;font-weight: 300;color: #888;line-height: 22px;padding: 10px 10px;}
#prolist .item a .img{width:100%;overflow: hidden; }
#prolist .item a .img img{width:100%;}
#prolist .item a:hover{text-decoration: none;}
#prolist .item a:hover .img img{transform: scale(1.1);-webkit-transform: scale(1.1);}
#prolist .item a:hover .info h4{color:#1f7ce6; }
#prolist .item:hover:after{width: 40%;left: 50%;margin-left: -20%;}
#prolist .item:hover{
-webkit-box-shadow: 1px 0px 20px rgba(31, 124, 230, 0.4);
box-shadow: 1px 0px 20px rgba(31, 124, 230,0.4);}
/*pro-bar*/
.pro-bar{width: 100;padding: 30px 0;background-color: #e2e2e2;}
.pro-bar .main{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content:center;
	-moz-justify-content:center;
    -ms-justify-content:center;
    -o-justify-content:center;
    justify-content:center;
	
}
.pro-bar .pro-bar-item{width: 25%;position: relative;text-align: center;}
.pro-bar .pro-bar-item:after{
	content: '';
	position: absolute;
	width: 1px;
	height: 50%;
	background-color: #adadad;right: 0;top:50%;margin-top: -20%;
}
.pro-bar .pro-bar-item:nth-child(4n):after{
	content: '';
	position: absolute;
	width: 0;
}
.pro-bar .pro-bar-item i{display: block;margin: 15px auto;font-size: 6.6rem; color: #1f7ce6}
.pro-bar .pro-bar-item h3{font-size: 22px;color: #333;}
.pro-bar .pro-bar-item a{display: block;font-size:14px;width: 30%;line-height: 26px; color: #1f7ce6;border:1px solid #1f7ce6;border-radius: 20px;margin: 15px auto;}
.pro-bar .pro-bar-item a:hover{background-color: #1f7ce6;color: #fff;text-decoration: none;-webkit-box-shadow: 0 5px 10px rgba(31, 124, 230, 0.4);box-shadow: 0 5px 10px rgba(31, 124, 230,0.4);}
.pro-tj{display: flex;display:-webkit-flex;justify-content:center;width: 100%;margin: 30px auto;
background-color: #fff;
-webkit-box-shadow: 10px 0 30px rgba(0,0,0,0.05);
box-shadow: 10px 0 30px rgba(0,0,0,0.05);}
.pro-tj .pro-tj-l{width: 30%;border-right: 1px solid #eee;}
.pro-tj .pro-tj-l a{display: block;padding:30px 10px 10px 10px;}
.pro-tj .pro-tj-l a .img{width: 100%;text-align: center;}
.pro-tj .pro-tj-l a .img img{width: 80%;}
.pro-tj .pro-tj-l a .info{width: 100%;text-align: center;padding: 30px 0 0 0;}
.pro-tj .pro-tj-l a .info h3{font-size: 20px;color: #333;font-weight: 800;letter-spacing: 1px;}
.pro-tj .pro-tj-l a .info p{font-size: 14px;color: #666;}
.pro-tj .pro-tj-l a:hover{text-decoration: none;}
.pro-tj .pro-tj-l a:hover .img img{transform: scale(1.2);-webkit-transform: scale(1.2);}
.pro-tj .pro-tj-list{width: 70%;height:100%;display: flex;display:-webkit-flex;justify-content:center;flex-wrap: wrap;}
.pro-tj .pro-tj-list li{width: 50%;
border-right: 1px solid #eee;border-bottom: 1px solid #eee;}
.pro-tj .pro-tj-list li:nth-child(3){border-bottom:none;}
.pro-tj .pro-tj-list li:nth-child(4){border-bottom:none;}
.pro-tj .pro-tj-list li a{padding: 30px; display: block;display: flex;display:-webkit-flex;justify-content:center;}
.pro-tj .pro-tj-list li a .img{width: 50%;}
.pro-tj .pro-tj-list li a .img img{width: 90%}
.pro-tj .pro-tj-list li a .info{width: 50%;padding: 30px 0 0 5px;}
.pro-tj .pro-tj-list li a .info h3{font-size: 16px;color: #333;font-weight: 800;letter-spacing: 1px;}
.pro-tj .pro-tj-list li a .info p{font-size: 14px;color: #666;}
.pro-tj .pro-tj-list li a .info span{text-align: center; display: block;width: 60px;line-height: 20px;border-radius: 10px;font-family: Arial, "sans-serif"; border: 1px solid #999;font-size: 11px; text-transform: uppercase;color: #666;}
.pro-tj .pro-tj-list li a:hover{text-decoration: none;}
.pro-tj .pro-tj-list li a:hover span{background-color: #1f7ce6;color: #fff;border:none;
-webkit-box-shadow:0 5px 10px rgba(31,124,230,0.3);
box-shadow:0 5px 10px rgba(31,124,230,0.3);}
.pro-tj .pro-tj-list li a:hover .img img{transform: scale(1.2);-webkit-transform: scale(1.2);}


/*app*/
.index-app{background-image: url("../images/bg2.jpg")/*tpa=http://www.leixmark.com/images/bg2.jpg*/;background-repeat: no-repeat;background-position: center top;padding: 60px 0 30px 0;}
#applist{padding: 0 0 30px 0;}
#applist .item{width:360px;height:250px;margin:10px auto;text-align: center;-webkit-box-shadow: 1px 0 20px rgba(0,0,0,0.05);box-shadow: 1px 0 20px rgba(0,0,0,0.05);}
#applist .item a{color:#333;display: block;position:relative;width:100%;height:100%;}
#applist .item a:after{
	position: absolute;
	content: '';bottom:0;right:0;z-index: 10;
	width: 6px;height: 30%;background-color:#1f7ce6;
	transition:all 0.5s;
    -webkit-transition:all 0.5s; /* Safari and Chrome */
    -moz-transition:all 0.5s;
    -o-transition:all 0.5s;
    -ms-transition:all 0.5s;
}
#applist .item a .info{text-align: center;width: 100%;padding: 0 8% 0 0; height: 30%;position: absolute;z-index: 12; bottom: 0;left: 0;text-align: right;
background-color: rgba(0,0,0,.4)}
#applist .item a .info h3{font-size:20px;color:#fff;font-weight: 500;}
#applist .item a .info h4{font-size:12px;color: #fff;font-weight: 200;}
#applist .item a .img{width:100%;height: 100%;background-size: cover;background-repeat: no-repeat;}
#applist .item a:hover{text-decoration: none;}
#applist .item a:hover:after{width: 100%;}
#applist .item:hover{
-webkit-box-shadow: 10px 0 40px rgba(0,0,0,0.8);
box-shadow: 10px 0 40px rgba(0,0,0,0.8);}
#applist .item a:hover .info{background-color: transparent;}



/*index_customers*/
.index-customers{background-color:#f2f2f2;padding: 60px 0 60px 0; }
.index-customers .customerslist{max-width: 1200px;width: 96%; margin: 0 auto;}
.index-customers .customerslist li{float: left;margin:0 1% 1% 0;width: 24%;} 
.index-customers .customerslist li a{background-color: #fafafa;display: block;text-align: center;padding-top:35px;line-height:70px;font-size: 18px;color: #999; }
.index-customers .customerslist li:nth-child(4n){margin: 0 0 1% 0;}
.index-customers .customerslist li a img{
	opacity:0.3;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
}
.index-customers .customerslist li a:hover{
	background-color: #fff;
	-webkit-box-shadow: 1px 10px 30px rgba(0,0,0,0.05);
	box-shadow: 1px 10px 30px rgba(0,0,0,0.05);
}
.index-customers .customerslist li a:hover img{
	opacity:1;
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    filter: grayscale(0%);
}
/*news*/
.index-news{background-image: url("../images/bg3.jpg")/*tpa=http://www.leixmark.com/images/bg3.jpg*/;background-repeat: no-repeat;background-position: center top;padding: 60px 0 30px 0;}
.index-news .newslist{display: flex;display:-webkit-flex;justify-content:center;flex-wrap: wrap;padding:30px 0 0 0}
.index-news .newslist li{width: 33.33%;padding: 30px;}
.index-news .newslist li a{display:block;padding: 160px 40px 40px ;position: relative;
	background-color: rgba(0,0,0,0.2);
	-webkit-box-shadow: 1px 0px 30px rgba(0,0,0,0.05);
	box-shadow: 1px 0px 30px rgba(0,0,0,0.05);}
.index-news .newslist li a:after{
	position: absolute;
	content: '';
	bottom: 0;
	left: 0;
	width: 100%;
	height: 0;
	background-color: #1f7ce6;
	transition:all 0.5s;
    -webkit-transition:all 0.5s; /* Safari and Chrome */
    -moz-transition:all 0.5s;
    -o-transition:all 0.5s;
    -ms-transition:all 0.5s;
	z-index: 1;}
.index-news .newslist li a .img{width: 80%;height: 130px;overflow: hidden;background-size: cover;position: absolute;z-index: 12;top: 30px;left: 50%;margin-left: -40%;}
.index-news .newslist li a .info{width:100%;position: relative;z-index: 12;}
.index-news .newslist li a .info h3{font-size: 16px;letter-spacing: 1px;color: #fff;position: relative;margin-bottom: 30px}
.index-news .newslist li a .info h3:after{
		position: absolute;
	    content: '';bottom:-15px;left:0;z-index: 10;
	    width: 30px;height:1px;background-color:rgba(255,255,255,0.6);}
.index-news .newslist li a .info h4{font-size: 14px;color: #fff;}
.index-news .newslist li a .info p{font-size: 14px;line-height: 25px;color: rgba(255,255,255,0.6);margin: 0 0 20px 0;}
.index-news .newslist li a .info span{width: 100px;line-height: 28px;display: block;border: 1px solid #fff;border-radius: 20px;
color: #fff;padding-left: 20px; text-transform: uppercase;position: relative;}
.index-news .newslist li a .info span i{font-size: 2.5rem;position: absolute;right: 5px;}
.index-news .newslist li a:hover{text-decoration:none;
	-webkit-box-shadow: 1px 10px 30px rgba(0,0,0,0.08);
	box-shadow: 1px 10px 30px rgba(0,0,0,0.08);}
.index-news .newslist li a:hover:after{	height: 100%;}
.index-news .newslist li a:hover .info span{
background-color: #fff;width: 120px;color: #1f7ce6;
-webkit-box-shadow:0 5px 10px rgba(31,124,230,0.3);
box-shadow:0 5px 10px rgba(31,124,230,0.3);}
.index-news .newslist li a:hover .img{width: 100%;left: 0;top:0;margin-left: 0;height: 150px;}
